<template>
  <el-button
    :size="widget.options.size"
    :type="widget.options.type"
    :plain="widget.options.plain"
    :text="widget.options.text"
    :bg="widget.options.bg"
    :link="widget.options.link"
    :round="widget.options.round"
    :circle="widget.options.circle"
    :loading="widget.options.loading"
    :disabled="widget.options.disabled"
    :icon="widget.options.icon"
    :color="widget.options.color"
    @click.stop="selectField"
  >
  <slot></slot>
    {{ widget.options.buttonText }}
  </el-button>
</template>

<script setup>
import { assignmentWidget } from "@/views/pageDesign/components/globalVariable";

defineOptions({
  name: "buttonWidget",
  inheritAttrs: false,
});

let $props = defineProps({
  widget: {
    type: Object,
    required: true,
  },
});

let selectField = () => {
  assignmentWidget($props.widget);
};
</script>

<style lang="scss" scoped></style>
